<template>
	<view class="kind">
		<view class="box" v-for="item in goodsList" :key="item.id">
			<view class="imgb" @tap="go(item)">
				<image :src="item.img" mode="" class="img"></image>
				<view class="">
					<text class="title">{{item.ctitle}}</text>
				</view>
				
				<view class="">
					<text class="etitle">{{item.etitle}}</text>
				</view>
			</view>
			
			
		</view>
	</view>
</template>

<script>
	import { list} from "../../util/kind/index.js"
	import mix from "@/mixins/index.js"
	export default {
		data() {
			return {
				goodsList:[]
			};
			
			
		},
		mixins:[mix],
		
		methods:{
			go(val){
				// console.log(val)
				
				uni.navigateTo({
					url:'./info/info?id='+ encodeURIComponent(JSON.stringify(val))
				})
			} 
		},
		
		
		onLoad(){
			
			list().then(res=>{
				console.log(res)
				this.goodsList=res.data.data
				
			})
		
		}
		
		
		
		
	}
</script>

<style lang="scss">
.kind{
	padding-top: var(--status-bar-height);
}
.box{
	width: 670px;
	height: 250px;
	background-color:#f1ece7;
}
.imgb{
	width: 320px;
	height: 200px;
	background-color:#D5D5D5;
	border-radius: 20px;
	margin-left: 20px;
}
.img{
	width: 200px;
	height: 150px;
	position: relative;
	left: 100px;
	margin-top: 20px;
}
.title{
	position: absolute;
	left: 30px;
	margin-top: -100px;
	font-size: 28px;
	color: #3E3E3E;
	letter-spacing: 3.43px;
}
.etitle{
	position: absolute;
	left: 30px;
	margin-top: -60px;
	ont-size: 34px;
	color: #7F7F7F;
	letter-spacing: 2.14px;
}
</style>
